<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>线索管理</title>
    <link rel="shortcut icon" type="image/x-icon" href="../../favicon.ico" />
    <link rel="stylesheet" href="../../component/pear/css/pear.css">
    <script src="../../js/myUtils.js"></script>
</head>

<body class="pear-container">
    <!-- 搜索（暂不做） -->
    <!-- <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">受理编号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="no" id="no" placeholder="" class="layui-input">
                    </div>
                    
                    <button class="pear-btn pear-btn-md pear-btn-primary" lay-submit="" lay-filter="search">
                        <i class="layui-icon layui-icon-search"></i>
                        查询
                    </button>
                    <button type="reset" class="pear-btn pear-btn-md">
                        <i class="layui-icon layui-icon-refresh"></i>
                        重置
                    </button>
                </div>
            </form>
        </div>
    </div> -->

    <div class="layui-card">
        <div class="layui-card-body">
            <table class="layui-hide" id="excel-table" lay-filter="excel-table"></table>
        </div>
    </div>

    <script type="text/html" id="involvedRegionTpl">
        {{# layui.each(d.involvedRegion, function(index, item){ }}
            <div class="layui-input-inline">
                {{#  if(item.province != null){ }}
                    {{#  if(item.city != null){ }}
                        {{#  if(item.area != null){ }}
                            {{item.province}}{{item.city}}{{item.area}}
                        {{#  } else { }}
                            {{item.province}}{{item.city}}
                        {{#  } }}
                    {{#  } else { }}
                        {{item.province}}
                    {{#  } }}
                {{#  } }}
            </div>
        {{# }); }}
    </script>

    <script type="text/html" id="blackNameTpl">
        {{# layui.each(d.reporteders, function(index, item){ }}
        <div class="layui-input-inline">{{item.name}}</div>
        {{# }); }}
    </script>

    <script type="text/html" id="blackCardIdTpl">
        {{# layui.each(d.reporteders, function(index, item){ }}
        {{#  if(item.blackCardId != ''){ }}
        <div class="layui-input-inline">{{item.blackCardId}}&nbsp;</div>
        {{#  } }}
        {{# }); }}
    </script>

    <script type="text/html" id="caseTypeTpl">
        {{# layui.each(d.reporteders, function(index, item){ }}
        {{#  if(item.caseType != ''){ }}
        <div class="layui-input-inline">{{item.caseType}}&nbsp;</div>
        {{#  } }}
        {{# }); }}
    </script>

    <script type="text/html" id="blackDepartmentTpl">
        {{# layui.each(d.reporteders, function(index, item){ }}
        {{#  if(item.blackDepartment == '未选择'){ }}
        <div class="layui-input-inline">无单位</div>
        {{#  } else { }}
        <div class="layui-input-inline">{{item.blackDepartment}}</div>
        {{#  } }}
        {{# }); }}
    </script>

    <script type="text/html" id="involvedUnitTpl">
        {{# layui.each(d.involvedUnit, function(index, item){ }}
            <div class="layui-input-inline">{{item}}</div>
        {{# }); }}
    </script>

    <script type="text/html" id="sendDepartmentTpl">
        {{#  if(d.sendDepartment != ''){ }}
            {{#  if(d.sendDepartment.value != -1){ }}
                {{#  if(d.sendDepartment.value != 0){ }}
                <div class="layui-input-inline">{{d.sendDepartment.name}}</div>
                {{#  } else { }}
                <div class="layui-input-inline">{{d.sendDepartmentMemo}}</div>
                {{#  } }}
            {{#  } }}
        {{#  } }}
    </script>

    <script type="text/html" id="reportFromTpl">
        {{#  if(d.reportFrom.value != -1){ }}
        <div class="layui-input-inline">{{d.reportFrom.name}}</div>
        {{#  } }}
    </script>

    <script type="text/html" id="levelTpl">
        {{#  if(d.level.value != -1){ }}
        <div class="layui-input-inline">{{d.level.name}}</div>
        {{#  } }}
    </script>

    <script type="text/html" id="conclusionTpl">
        {{#  if(d.conclusion.value != -1){ }}
        <div class="layui-input-inline">{{d.conclusion.name}}</div>
        {{#  } }}
    </script>

    <script type="text/html" id="fourShapesTpl">
        {{#  if(d.fourShapes.value != -1){ }}
        <div class="layui-input-inline">{{d.fourShapes.name}}</div>
        {{#  } }}
    </script>

    <script type="text/html" id="processResultTpl">
        {{#  if(d.processResult.value != -1){ }}
        <div class="layui-input-inline">{{d.processResult.name}}</div>
        {{#  } }}
    </script>

    <script type="text/html" id="issueTypeTpl">
        {{# layui.each(d.issueType, function(index, item){ }}
        {{#  if(d.issueType.length != 0){ }}
        <div class="layui-input-inline">{{item}}</div>
        {{#  } }}
        {{# }); }}
    </script>

    <script type="text/html" id="isSendTpl">
        {{#  if(d.isSend === '否'){ }}
        <span style="color: #ff4927;">{{ d.isSend }}</span>
        {{#  } else { }}
        <span style="color: #0084ff;">{{ d.isSend }}</span>
        {{#  } }}
    </script>

    <script type="text/html" id="reportTypeTpl">
        {{#  if(d.reportType != '未选择'){ }}
            {{ d.reportType }}
        {{#  }  }}
    </script>

    <script type="text/html" id="reportStateTpl">
        {{#  if(d.reportState === '已移送，未反馈' || d.reportState === '退回完善'){ }}
        <span style="color: #F6AD55;">{{ d.reportState }}</span>
        {{#  } else if(d.reportState === '已反馈，待审核' || d.reportState === '申请查结') { }}
        <span style="color: #0084ff;">{{ d.reportState }}</span>
        {{#  } else if(d.reportState === '已完成') { }}
        <span style="color: #2ebd59;">{{ d.reportState }}</span>
        {{#  } else { }}
            {{ d.reportState }}
        {{#  } }}
    </script>

    <script type="text/html" id="isRepeatTpl">
        {{#  if(d.isRepeat === '不重复'){ }}
        {{ d.isRepeat }}
        {{#  } else { }}
        <span style="color: #ff4927;">{{ d.isRepeat }}</span>
        {{#  } }}
    </script>

    <script type="text/html" id="progressTpl">
        {{#  if(d.progress === '查结'){ }}
        <span style="color: #2ebd59;">{{ d.progress }}</span>
        {{#  } else if((d.progress === '正在核查')) { }}
        <span style="color: #0084ff;">{{ d.progress }}</span>
        {{#  } else { }}
        <span style="color: #F6AD55;">{{ d.progress }}</span>
        {{#  } }}
    </script>

    <script type="text/html" id="toolbar">
        <!-- 使用徐增加属性: id="uploadExcel" -->
    <!-- <button class="pear-btn pear-btn-success pear-btn-md" lay-event="uploadExcel">
            <i class="layui-icon layui-icon-upload-drag"></i> 导入数据
        </button> -->
    <button class="pear-btn pear-btn-primary pear-btn-md" style="cursor: default;">
        <i class="layui-icon layui-icon-console"></i> 数据表格
    </button>
    </script>

    <script type="text/html" id="column-toolbar">
        <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit">
            <span class="icon pear-icon" title="编辑">&#xe6a3;</span>
        </button>
        <button class="pear-btn pear-btn-warming pear-btn-sm" lay-event="uploadFile">
            <span class="icon pear-icon" title="附件">&#xe6ab;</span>
        </button>

        <button class="pear-btn pear-btn-sm" lay-event="history">
            <span class="icon pear-icon" title="历史记录">&#xe6d9;</span>
        </button>
    </script>

    <script src="../../js/jquery.js"></script>
    <script src="../../component/layui/layui.js"></script>
    <script src="../../component/pear/pear.js"></script>

    <script>
        var userInfoData = layui.data('userInfo').item
        var options = layui.data('options').data
        var locationParams = myUtils.GetRequest()
        // console.log("locationParams:", locationParams)
        // layui.use begin

        layui.use(['table', 'form', 'upload', 'Api', 'request'], function () {
            var $ = layui.$;
            var form = layui.form,
                table = layui.table,
                Api = layui.Api,
                request = layui.request,
                upload = layui.upload;

            var type = locationParams.type
            var url = ''
            var param = {}
            if (type === 'all') {
                url = Api.report
            } else if (type === 'wait') {
                url = Api.homeIsSend
                param = {
                    isSend: 0  // isSend: "否"
                }
            } else if (type === 'send') {
                url = Api.homeIsSend
                param = {
                    isSend: 1   // isSend: "是"
                }
            } else if (type === 'toFeedback') {
                url = Api.reportState
                param = {
                    reportState: 1   // 待反馈
                }
            } else if (type === 'toReview') {
                url = Api.reportState
                param = {
                    reportState: 2   // 已反馈
                }
            } else if (type === 'sendBack') {
                url = Api.reportState
                param = {
                    reportState: 4   // 退回件
                }
            } else if (type === 'timeout') {
                url = Api.homeTimeout
            } else if (type == 'done') {
                url = Api.homeDone
                param = {
                    progress: 2 // progress: "查结"
                }
            } else if (type == 'echarts1') {
                url = locationParams.url
                sendDepartment = JSON.parse(locationParams.requestParams).sendDepartment
                url = url + '?sendDepartment=' + sendDepartment
            } else if (type == 'echarts3') {
                url = Api.getAllByReportCaseType
                param = {
                    reportCaseType: parseInt(locationParams.reportCaseType)
                }
            }
            param['isValid'] = layui.data('consoleSelect').item
            // console.log('param', param)
            var ToolbarList = [{
                title: '刷新',
                layEvent: 'refresh',
                icon: 'layui-icon-refresh',
            }, 'filter']
            if (userInfoData.departmentCode == -2 && userInfoData.role == 0) {  // 仅杉哥部门可打印和导出
                ToolbarList = [{
                title: '刷新',
                layEvent: 'refresh',
                icon: 'layui-icon-refresh',
            }, 'filter', 'exports', 'print']
            }
            var pageChoose = [10, 100]
            var myTable = table.render({
                elem: '#excel-table',
                id: 'excel-table',
                autoSort: true,
                url: url,
                where: param,
                headers: {
                    'token': localStorage.token
                },
                parseData: function (res) { //res 即为原始返回的数据
                    if (res.errno != 0) {
                        layer.alert(res.errmsg, { icon: 2 }, function (index) {
                            layer.close(index);
                        });
                    }
                    var data = res.data.list,
                        data = myUtils.parseData(data)
                    pageChoose.pop()
                    pageChoose.push(res.data.total)
                    return {
                        "code": res.errno, //解析接口状态
                        "msg": res.errmsg, //解析提示文本
                        "count": res.data.total, //解析数据长度
                        "data": data //解析数据列表
                    };
                },
                request: {
                    pageName: 'page_index' //页码的参数名称，默认：page
                    ,
                    limitName: 'page_size' //每页数据量的参数名，默认：limit
                },
                title: "线索信息表",
                page: {
                    limit: 10,
                    limits: pageChoose,
                },
                loading: false,
                // skin: 'line',
                toolbar: '#toolbar',
                defaultToolbar: ToolbarList,  /* 调整数据表格右侧工具栏 */
                smartReloadModel: true,
                cols: [
                    [   // 一级表头
                        { sort: false, align: 'center', hide: false, type: 'numbers', fixed: 'left', title: '序号' },

                        { sort: true, align: 'center', hide: false, minWidth: 170, field: 'no', title: '受理编号' },
                        { sort: true, align: 'center', hide: true, minWidth: 150, field: 'mailNo', title: '来电来信线索编号', },
                        { sort: true, align: 'center', hide: true, minWidth: 150, field: 'reportType', title: '线索来源', templet: '#reportTypeTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 150, field: 'reportFrom', title: '一手来源单位' },
                        { sort: true, align: 'center', hide: true, minWidth: 160, field: 'moreLetter', title: '还要来信反映' },
                        { sort: false, align: 'center', hide: true, minWidth: 200, field: 'involvedRegion', title: '涉及区域', templet: '#involvedRegionTpl' },
                        { sort: false, align: 'center', hide: false, minWidth: 120, field: 'name', title: '举报人姓名', templet: '<span>{{d.reporter.name}}</span>' },
                        { sort: false, align: 'center', hide: true, minWidth: 200, field: 'cardId', title: '身份证号', templet: '<span>{{d.reporter.cardId}}&nbsp;</span>' },
                        { sort: false, align: 'center', hide: true, minWidth: 120, field: 'phone', title: '联系方式', templet: '<span>{{d.reporter.phone}}</span>' },
                        { sort: false, align: 'center', hide: true, minWidth: 120, field: 'location', title: '住所地', templet: '<span>{{d.reporter.location}}</span>' },

                        { sort: false, align: 'center', hide: false, minWidth: 160, field: 'reporteders', title: '被举报人姓名', templet: '#blackNameTpl' },
                        { sort: false, align: 'center', hide: false, minWidth: 160, field: 'reporteders', title: '被举报人单位', templet: '#blackDepartmentTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 200, field: 'blackCardId', title: '被举报人身份证', templet: '#blackCardIdTpl' },
                        { sort: true, align: 'center', hide: false, minWidth: 120, field: 'question', title: '主要问题', },
                        { sort: true, align: 'center', hide: false, minWidth: 110, field: 'reportCaseType', title: '涉案类别' },
                        { sort: true, align: 'center', hide: true, minWidth: 120, field: 'caseType', title: '线索类别', templet: '#caseTypeTpl' },

                        { sort: false, align: 'center', hide: true, minWidth: 220, field: 'issueType', title: '顽瘴痼疾类别', templet: '#issueTypeTpl' },
                        { sort: false, align: 'center', hide: true, minWidth: 160, field: 'involvedUnit', title: '涉及单位', templet: '#involvedUnitTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 130, field: 'isVolunteered', title: '主动说明情况' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'isSweepBlack', title: '扫黑除恶' },
                        { sort: false, align: 'center', hide: true, minWidth: 150, field: 'completeDataMemo', title: '数据完善备注', },

                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'isSend', title: '是否移送', templet: '#isSendTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 130, field: 'reportState', title: '线索状态', templet: '#reportStateTpl' },
                        { sort: true, align: 'center', hide: false, minWidth: 110, field: 'sendDepartment', title: '移送单位' },
                        { sort: true, align: 'center', hide: false, minWidth: 110, field: 'sendTime', title: '移交时间', },
                        { sort: true, align: 'center', hide: true, minWidth: 180, field: 'sendToId', title: '移送编号' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'feedbackTimeLimit', title: '反馈时限', },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'feedbackTime', title: '反馈时间', },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'doneTimeLimit', title: '查结时限', },

                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'level', title: '核查等级' },
                        { sort: true, align: 'center', hide: false, minWidth: 110, field: 'progress', title: '核查进展', templet: '#progressTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'conclusion', title: '核查结论' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'fourShapes', title: '四种形态' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'processResult', title: '处理结果' },
                        { sort: false, align: 'center', hide: true, minWidth: 150, field: 'feedbackMemo', title: '核查反馈备注', },

                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'isRepeat', title: '是否重复', templet: '#isRepeatTpl' },
                        { sort: true, align: 'center', hide: true, minWidth: 110, field: 'enterer', title: '录入人', },
                        { sort: false, align: 'center', hide: false, minWidth: 140, title: '操作', fixed: 'right', toolbar: '#column-toolbar' }
                    ]
                ],
                // size: 'lg',
                done: function (res, curr, count) {
                    // dataAllCount = count
                    // currData = res.data
                    uploadRender()
                }
            });

            table.on('toolbar(excel-table)', function (obj) {
                if (obj.event === 'refresh') {
                    table.reload('excel-table');
                }
            });

            // 左上方工具条点击事件
            table.on('toolbar', function (obj) {
                var data = obj.data;
                var event = obj.event;
                if (event === 'uploadExcel') {
                    layer.msg('玩命开发中...');
                }
            });

            function uploadRender() {
                upload.render({ //允许上传的文件后缀
                    elem: '#uploadExcel'
                    , url: Api.importData//改成您自己的上传接口
                    , accept: 'file' //普通文件
                    , field: 'excelFile'
                    , exts: 'xlsx' //只允许上传压缩文件
                    , done: function (res) {
                        // console.log(res)
                        if (res.errno === 0) {
                            layer.msg("导入成功", {
                                icon: 1
                            })
                        } else {
                            layer.msg(res.errmsg, {
                                icon: 2
                            })
                        }
                    }
                });
            }

            // 每行最右侧工具按钮
            table.on('tool', function (obj) {
                var data = obj.data;
                var event = obj.event;
                if (event === 'edit') {
                    if (userInfoData.departmentCode != -2) { // 子部门
                        let code = myUtils.getCodeFromName(options.reportState, data.reportState)
                        if (code != 3) { // 未查结前可修改
                            edit(data.id)
                        } else {
                            layer.alert('未查结前可修改！', { icon: 0 })
                        }
                    } else {
                        edit(data.id)
                    }
                } else if (event === 'uploadFile') {
                    // 上传附件
                    // 上传附件
                    let code = myUtils.getCodeFromName(options.reportState, data.reportState)
                    attachPage(data.no, data.id, code)
                } else if (event === 'history') {
                    // console.log("userInfoData: ", userInfoData)
                    if (userInfoData.role != 0) {
                        // 弹窗无权限
                        // console.log("弹窗无权限")
                        layer.alert('对不起，您无此权限！', { icon: 4, })
                    } else {
                        seeHistory(data.id)
                    }
                }
            });

            function edit(id) {
                let editPageUrl = '../../view/excel/excel-edit.html'
                if (userInfoData.departmentCode != -2) {
                    editPageUrl = '../../view/excel/excel-edit-son.html'
                }
                let params = {}
                let url = Api.report + '/' + id
                var success = function (res) {
                    if (res.errno == 0) {
                        layui.data('reportInfo', { key: 'item', value: res.data });
                        layer.open({
                            content: encodeURI(editPageUrl),
                            title: "编辑",
                            area: ['90%', '95%'],
                            type: 2,
                            maxmin: true,
                            shadeClose: true,
                            end: function (res) {
                                layui.data('reportInfo', { key: 'item', remove: true });
                            }
                        });
                    }
                }
                request.get(url, params, success)
            }

            function attachPage(no, id, code) {
                var url = '../../view/nav/attachment.html?no=' + no + '&id=' + id + '&code=' + code
                layer.open({
                    type: 2,
                    closeBtn: 1,
                    title: '📚 附件',
                    area: ['90%', '90%'],
                    content: encodeURI(url),
                    scrollbar: false,
                    maxmin: true,
                    shadeClose: true,
                    success: function () {

                    },
                    end: function () {
                        // table.reload('excel-table');
                    }
                });
            }

            function seeHistory(id) {
                var url = '../../view/excel/excel-history.html?id=' + id
                layer.open({
                    type: 2,
                    closeBtn: 1,
                    title: '🕒 历史记录',
                    area: ['90%', '90%'],
                    content: encodeURI(url),
                    scrollbar: false,
                    maxmin: true,
                    shadeClose: true,
                    success: function () {

                    },
                    end: function () {
                        // table.reload('excel-table');
                    }
                });
            }

            // 表格重载（筛选数据）
            form.on('submit(search)', function (form) {
                // console.log("form.field: ", form.field)
                params = form.field
                params['page_index'] = 1
                table.reload('excel-table', {
                    where: params
                });
                return false;
            });

            // filter筛选列全选
            table.on('toolbar()', function (obj) {
                var config = obj.config;
                var btnElem = $(this);
                var tableId = config.id;
                var tableView = config.elem.next();
                switch (obj.event) {
                    case 'LAYTABLE_COLS':
                        // 给筛选列添加全选还有反选的功能
                        var panelElem = btnElem.find('.layui-table-tool-panel');
                        var checkboxElem = panelElem.find('[lay-filter="LAY_TABLE_TOOL_COLS"]');
                        var checkboxCheckedElem = panelElem.find('[lay-filter="LAY_TABLE_TOOL_COLS"]:checked');
                        $('<li class="layui-form" lay-filter="LAY_TABLE_TOOL_COLS_FORM">' +
                            '<input type="checkbox" lay-skin="primary" lay-filter="LAY_TABLE_TOOL_COLS_ALL" '
                            + ((checkboxElem.length === checkboxCheckedElem.length) ? 'checked' : '') + ' title="全选">' +
                            '<span class="LAY_TABLE_TOOL_COLS_Invert_Selection">反选</span></li>')
                            .insertBefore(panelElem.find('li').first())
                            .on('click', '.LAY_TABLE_TOOL_COLS_Invert_Selection', function (event) {
                                layui.stope(event);
                                // 反选逻辑
                                panelElem.find('[lay-filter="LAY_TABLE_TOOL_COLS"]+').click();
                            });
                        form.render('checkbox', 'LAY_TABLE_TOOL_COLS_FORM');
                        break;
                }
            });

            // 监听筛选列panel中的全选
            form.on('checkbox(LAY_TABLE_TOOL_COLS_ALL)', function (obj) {
                $(obj.elem).closest('ul')
                    .find('[lay-filter="LAY_TABLE_TOOL_COLS"]' + (obj.elem.checked ? ':not(:checked)' : ':checked') + '+').click();
            });

            // 监听筛选列panel中的单个记录的change
            $(document).on('change', 'input[lay-filter="LAY_TABLE_TOOL_COLS"]', function (event) {
                var elemCurr = $(this);
                // 筛选列单个点击的时候同步全选的状态
                $('input[lay-filter="LAY_TABLE_TOOL_COLS_ALL"]')
                    .prop('checked',
                        elemCurr.prop('checked') ? (!$('input[lay-filter="LAY_TABLE_TOOL_COLS"]').not(':checked').length) : false);
                form.render('checkbox', 'LAY_TABLE_TOOL_COLS_FORM');
            });
        });
    </script>
</body>

</html>